<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../layui/css/layui.css">
    <link rel="stylesheet" href="../layui/css/formSelects-v4.css">
    <script src="../layui/layui.js"></script>
    <script src="../js/jquery.min.js"></script>
    <script type="text/javascript" src="../js/vue.js"></script>

</head>
<body>
<div id="story">
    <input type="hidden" name="glId" id="glId" :value="garden_list.glId">
    <input type="hidden" :value="garden_list.glName" id="gradeName">
    <input type="hidden" :value="userName" id="userName">
    <hr/>
    <form action="" class="layui-form">
        <div class="layui-form-item">

            <div class="layui-inline">
                <label class="layui-form-label">年级</label>
                <div class="layui-input-inline" style="width: 200px;">
                    <select id="grade" lay-filter="grade">
                        <option value="-1">请选择</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline" style="margin-right: 0px;">
                <label class="layui-form-label" style="text-align: center;padding-right: 0px;padding-left: -10px;margin-left: -24px;">班级</label>
                <div class="layui-input-inline" style="width: 200px;">
                    <select id="manage">
                        <option value="-1">请选择</option>
                    </select>
                </div>
            </div>
            <button type="button" class="layui-btn" onclick="reloadData()" lay-submit="" lay-filter="demo1">查询</button>
        </div>
    </form>
    <table class="layui-hide" id="teList" lay-filter="teList"></table>
</div>

<script>
    var table ;
    function reloadData(){
        //执行重载
        table.reload('teList', {
            page: {
                curr: 1 //重新从第 1 页开始
            }
            ,where: {
                pmId:$("#manage").val(),
            }
        });
    }

    layui.config({
        base: '../../layui/'
    }).extend({
        formSelects: 'formSelects-v4'
    });
    var form;
    layui.use(['table','form','formSelects','laydate'], function(){
        table = layui.table;
        form = layui.form;
        var select = layui.formSelects;
        var laydate = layui.laydate;

        table.render({
            elem: '#teList'
            ,url:'http://localhost:9999/Sksh/index'
            ,page: true
            ,even : true
            ,id : "teList"
            ,cellMinWidth: 80
            ,toolbar:"#toolbarDemo",
            defaultToolbar: []
            ,cols: [[
                {field:'hello',type:'checkbox'}
                ,{field:'feeA', title: '编号'}
                ,{field:'cmName',  title: '班级名称',templet:function (d) {
                        return d.manage.cmName;
                    }}
                ,{field:'date',  title: '收费时间',templet:function (d) {
                            return d.start+" --- "+d.end;
                        }}
                ,{field:'did',  title: '状态',templet:function (d) {
                      if (d.did == 7){
                            return "未生效";
                        }
                        if (d.did == 8){
                            return "同意";
                        }
                        if (d.did == 9){
                            return "不同意";
                        }
                    }}
                ,{field:'remarks',  title: '说明'}
                ,{field:'adult', title: '生成人'},
                {toolbar: '#barDemo',title:'操作'}
            ]]
        });

        //监听行内的工具条
        table.on('tool(teList)',function (obj) {
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            if (layEvent == 'query') {
                $.get('rnIndex2.html?_'+new Date().getTime(),function (s) {
                layer.open({
                    type : 1,
                    title : data.manage.cmName+'的收费信息',
                    area:['1400px','500px'],
                    content:s,
                    anim:3,
                    btn : ['关闭'],
                    success:function(){
                        //对表单回填数据
                        $("#text1a").val(data.start);
                        $("#text2a").val(data.end);
                        $("#managess").val(data.pmId);
                        $.get("http://localhost:9999/Dictionary/index2",function (data) {
                            $.each(data,function(){
                                var opt = $("<option></option>").appendTo("#did");
                                opt.text(this.name).val(this.did);
                            });
                            layui.form.render();
                        })
                       /* form.val('rn2Form',data);*/

                    }
                })
                })
            }


        });
        form.on('select(grade)', function(data){
            if (data.value != -1){
                $("#manage").empty();
                $.get("http://localhost:9999/Manage/manage2",{glId:$("#glId").val(),gradeId: data.value},function(data){
                    $.each(data,function(){
                        var opt = $("<option></option>").appendTo("#manage");
                        opt.text(this.cmName).val(this.cmId);
                    });
                    layui.form.render();
                });
            }else{
                $("#manage").empty();
                $.get("http://localhost:9999/Manage/manageIndex",{glId:$("#glId").val()},function(data){
                    $.each(data.data,function(){
                        var opt = $("<option></option>").appendTo("#manage");
                        opt.text(this.cmName).val(this.cmId);
                    });
                    layui.form.render();
                });
            }
        })
        var pd = false;
        //头工具栏事件


    });
    var time9 = setInterval(function () {
        if ($("#glId").val() != ""){
            $.get("http://localhost:9999/Grade/gradeIndex",{gIId:$("#glId").val()},function(data){
                $.each(data,function(){
                    var opt = $("<option></option>").appendTo("#grade");
                    opt.text(this.gradeName).val(this.gradeId);
                });
                layui.form.render();
            });

            $.get("http://localhost:9999/Manage/manageIndex",{glId:$("#glId").val()},function(data){
                $.each(data.data,function(){
                    var opt = $("<option></option>").appendTo("#manage");
                    opt.text(this.cmName).val(this.cmId);
                });
                layui.form.render();
            });
            clearInterval(time9);
        }
    },100)
    var vm = new Vue({
        el:'#story',
        data:{
            garden_list:null,
            userName:null,
            datee:null
        },
        created:function () {
            var User_PermissionData = JSON.parse(sessionStorage.getItem("login_user"));
            this.garden_list = User_PermissionData.kmsUser.garden_list;
            this.userName = User_PermissionData.kmsUser.userName;
            this.datae = new Date().toLocaleDateString();
        },
    })
</script>


<script type="text/html" id="barDemo">
    <a lay-event="query"><i class="layui-icon layui-icon-edit"></i>&nbsp;查看</a>
</script>

<script type="text/html" id="shifou">
    <input type="checkbox" name="locked" value="{{d.locked}}" title="启用" lay-filter="roleTable" {{d.locked == 1 ? 'checked' : ''}}>
</script>

</body>
</html>